<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <style>

            /*具有id属性的p标签*/
            p[id]{
                background:red;
            }

            /*具有id属性，并且id的属性值等于d2*/
            div[id='d2']{
                background:green;
            }
            /*具有hello属性，并且hello属性的值以he开头*/
            div[hello^='he']{
                /*background:yellowgreen;*/
            }
            /*具有name属性，并且name属性的值以xi结尾*/
            div[name$='xi']{
                background:hotpink;
            }

            /*具有hello属性，并且hello属性的值中包含hc的值*/
            div[hello*='hc']{
                background:palevioletred;
            }
            /*具有id属性，具有name属性，并且name的属性值以xi结尾，具有class属性，class的属性值包含aaa*/
            div[id][name$='xi'][class*='aaa']{
                background:chartreuse;
            }
        </style>
    </head>
    <body>
        <div id="d1">div01</div>
        <div class="haha" id="d2" hello="ahc">div02</div>
        <div hello="hci">div03</div>
        <div name="xixi" hello="hehehcabc">div04</div>
        <div a="b" >div05</div>
        <p id="p">p1</p>
        <div id="hh" name="xixixi" class="wbsaaaa">我是div</div>
        <div style="color:red;">
           <p>百度</p>
        </div>
    </body>
</html>